<template>
  <div class="table-box">
    <el-table :data="goods"
              :header-cell-style="{height: '50px', backgroundColor: 'var(--prev-bg-white)'}"
              :row-style="{height: 50 +'px'}"
              border
              style="width: 100%">
      <el-table-column type="index">
      </el-table-column>
      <template v-for="(item, index) in columns">
        <el-table-column v-if="item.prop === 'exceptionTypeSplit'"
                         :key="index"
                         :prop="item.prop"
                         :label="item.label">
          <template slot-scope="scope">
            <span>破损：{{scope.row.exceptionTypeSplit.damageQuantity || 0}}</span>
            <span>缺少：{{scope.row.exceptionTypeSplit.lackQuantity || 0}}</span>
            <span>丢失：{{scope.row.exceptionTypeSplit.loseQuantity || 0}}</span>
            <span>其他：{{scope.row.exceptionTypeSplit.otherQuantity || 0}}</span>
          </template>
        </el-table-column>
        <el-table-column v-else
                         :key="index"
                         :prop="item.prop"
                         :label="item.label">
        </el-table-column>
      </template>
    </el-table>
  </div>
</template>

<script>

const columns = [
  {
    prop: 'goodsName',
    label: '货物名称'
  },
  {
    prop: 'quantity',
    label: '数量(件)'
  },
  {
    prop: 'signQuantity',
    label: '实签数'
  },
  {
    prop: 'signExceptionQuantity',
    label: '异常数'
  },
  {
    prop: 'exceptionTypeSplit',
    label: '签收异常'
  },
  {
    prop: 'exceptionDesc',
    label: '异常描述'
  },
]

export default {
  name: 'SignTable',
  props: {
    goods: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      columns,
      isLook: true
    }
  },
  computed: {
  },
  created() {
  }
}
</script>

<style scoped>
</style>